<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" 
	integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" 
	integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" 
	integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
	div {
		margin: 30px 20px;
	}
	th {
		text-align: center;
		background-color: gray;
	}
	td {
		text-align: center;
	}
</style>
<title>Insert title here</title>
</head>
<body>
	<div><h2>Customer List</h2></div>
	<div style="width: 600px;">
		<table class="table">
			<thead><tr><th>ID</th><th>Name</th><th>Sex</th><th>Salary</th><th>birthDate</th></tr></thead>
			<c:forEach items="${customers }" var="c">
				<tr>
					<td>${c.id }</td>
					<td>${c.name }</td>
					<td>
						<c:if test="${c.sex==true }">male</c:if>
						<c:if test="${c.sex==false }">female</c:if>
					</td>
					<td>${c.salary }</td>
					<td><fmt:formatDate value="${c.birth }" pattern="yyyy-MM-dd"/></td>
				</tr>
			</c:forEach>
		</table>
	</div>
</body>
</html>